<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>购买服务</title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/font-awesome-4.3.0/css/font-awesome.min.css" />
		<link href="../css/config.css" rel="stylesheet" />
		<link href="../css/base.css" rel="stylesheet" />
		<link href="../css/index.css" rel="stylesheet" />
		<link href="../css/my.css" rel="stylesheet" />
		<style>
			.ul-list-table{}
			.ul-list-table input{
				width:80px;
				background-color:#f7f7f7;
				border:1px solid #f7f7f7;
				height:30px;
				margin:5px;float:right;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav km-navbar">
			<a class="mui-icon mui-icon-back mui-pull-left mui-action-back"></a>
			<h1 id="title" class="mui-title km-view-title">购买服务</h1>
		</header>
		<div class="mui-content3 mui-fullscreen mui-scroll-wrapper" style="background:#f7f7f7;">
			<div class="mui-scroll">
				<ul class="ul-list-table">
					<li>图文咨询<font color="gray" size="2">刘医生</font><span>12元</span></li>
				</ul>
				<ul class="ul-list-table">
					<li>积分兑换<font color="gray" size="2">可兑1200分</font><span>=&nbsp;4元</span><input type="text" name="" id="" value="1200" /></li>
					<li>共需支付<span>8元</span></li>
				</ul>
				<p style="padding:10px;margin-top:10px;">选择支付方式</p>
				<ul class="ul-list-media-single" id="pay-method">
					<li><img src="../img/zhifubao.jpg" /><span>支付宝支付</span>
						<a class="check active"><i class="mui-icon mui-icon-checkmarkempty"></i></a>
					</li>
					<li><img src="../img/weixin.jpg" /><span>银行卡支付</span>
						<a class="check "><i class="mui-icon mui-icon-checkmarkempty"></i></a>
					</li>
				</ul>
				<a class="enter-button">确认支付</a>
			</div>
		</div>

		<script src="../js/mui.min.js"></script>
		<script src="../js/Global.js"></script>
		<script src="../js/index.js"></script>
		<script src="../js/zepto.min.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();
			mui('.mui-scroll-wrapper').scroll();
			//=======支付方式-点击事件
			mui('#pay-method').on('tap', 'a', function() {
				if(!$(this).hasClass("active")){
					$(this).addClass("active").parent("li").siblings("li").children("a").removeClass("active");
				}
			})
		</script>
	</body>

</html>